<template>
  <PageWrapper contentFullHeight>
    <ListTemplate
      :register-table="registerTable"
      addauth="system:basic:account:add"
      :method="methods"
    />
    <Handle @register="registerLayer" @success="tableMethods.reload" />
  </PageWrapper>
</template>
<script setup lang="ts">
  import ListTemplate from '@/views/common/operate/listTemplate.vue';

  import ApiV1 from '@/views/common/operate/ApiV1';
  import { createAsyncComponent } from '@/utils/factory/createAsyncComponent';

  import PageWrapper from '@/components/Page/src/PageWrapper.vue';
  import {
    apiPostAccountDelete,
    apiPostAccountList,
  } from '@/api/http/system/basic/account/account.api';
  import {
    useAccountListColumns,
    useAccountListSearchForm,
  } from '@/api/http/system/basic/account/account.data';

  defineOptions({
    name: 'SystemAccountList',
  });
  const Handle = createAsyncComponent(() => import('./handle.vue'));

  const { registerTable, registerLayer, methods, tableMethods } = ApiV1.useList({
    tableProps: {
      api: apiPostAccountList,
      columns: useAccountListColumns(),
      formConfig: {
        schemas: useAccountListSearchForm(),
      },
      rowKey: 'id',
    },
    editActionItem: {
      auth: 'system:basic:account:edit',
    },
    delActionItem: {
      auth: 'system:basic:account:delete',
    },
    delFN: apiPostAccountDelete,
    queryParams: {
      delParam: async (record) => {
        return [record['id']];
      },
    },
    auth: 'system:basic:account:list',
  });
</script>
